import { THEME_DARK, THEME_LIGHT } from "@/theme/color";
type ThemeType = "DARK" | "LIGHT";

export default function useTheme() {
  function initTheme() {
    const type = localStorage.getItem("theme-color") as ThemeType;
    if (type) {
      setTheme(type);
    } else {
      setTheme("LIGHT");
    }
  }
  function setTheme(type: ThemeType) {
    if (type === "DARK") {
      THEME_DARK.forEach((item) => {
        document.documentElement.style.setProperty(item.name, item.color);
      });
    } else {
      THEME_LIGHT.forEach((item) => {
        document.documentElement.style.setProperty(item.name, item.color);
      });
    }
  }

  function saveTheme(type: ThemeType) {
    localStorage.setItem("theme-color", type);
  }
  return {
    initTheme,
    setTheme,
    saveTheme,
  };
}
